大家好，今天使用到不一樣的有Switch以及主要使用ListTile

ListTile (Flutter Widget of the Week)

ListTile

使用時，它自己本身對title以及subtitle有設定不同的大小，還蠻方便
用Card為ListTile設置背景顏色

_buildListTile(IconData iconData, String title, String subtitle,
      bool _switchState, Function function) {
    return Card(
      color: Colors.white.withOpacity(0.2),
      child: ListTile(
        onTap: () {},
        leading: Icon(  //左邊Icon
          iconData,
          color: Colors.white,
        ),
        title: Text(
          title,
          style: titleStyle,
        ),
        subtitle: subtitle != null      //如果不是null則渲染一個Text
            ? Text(
                subtitle,
                style: subtitleStyle,
              )
            : null,
        trailing: _switchState != null      //如果不是null則渲染一個Switch 
            ? Switch(  
                value: _switchState,
                onChanged: (value) {
                  setState(() {
                    function(value);
                  });
                })
            : null,
      ),
    );
  }

注意以上的這段程式有很多地方我用null來判斷是否畫某部分UI，參數沒有使用{},[]可選的命名或不命名參數，如果覺得比較不清楚可以用{}或[]，看個人

Switch

Switch本身不控制狀態，所以在點擊的時候更新的話，就要使用setState
value帶的是boolean,點擊時在onChanged Callback裡更新值並setState

  /// Switch(
  ///   value: _giveVerse,
  ///   onChanged: (bool newValue) {
  ///     setState(() {
  ///       _giveVerse = newValue;
  ///     });
  ///   },
  /// )

不過可能因為我創了一個_buildListTile()，當我為傳進的值，賦予新值的時候似乎沒有更新到那個原本的值，所以我想的方法是傳進來一個Function讓我可以去更新那個值，不知道這樣對不對，還好它可以運行。

 _buildListTile(Icons.notifications, "允許通知", null, _notification,
            (value) {
          _notification = value; //就是直接傳Function進去給他執行，這樣改到_notification的值
        }),

這一頁就是很多的ListTile組合

ListView(
       children: [
         _buildTitle("視訊播放"),
         _buildListTile(Icons.wifi, "行動數據用量", "自動", null, null),
         _buildTitle("通知"),
         _buildListTile(Icons.notifications, "允許通知", null, _notification,
             (value) {
           _notification = value;
         }),
         _buildTitle("下載內容"),
         _buildListTile(Icons.wifi, "僅限Wi-Fi", null, _onlyWiFi, (value) {
           _onlyWiFi = value;
         }),
         _buildListTile(Icons.file_download, "智慧下載-Fi",
             "看完的集數會被刪除，並替換為下一集，僅限Wi-Fi模式使用。", _smartDownload, (value) {
           _smartDownload = value;
         }),
         _buildListTile(Icons.picture_in_picture_alt, "下載畫質", "標準", null, null)
       ],
     ),

附上今日之效果圖

如果有誤，請多多指教，謝謝～

GitHub連結： flutter-netflix-clone